<template>
  <div class="app-container">
    <div class="wise-crud">
      <div class="table-show">
        <div class="operation-block">
          <el-row class="oper-btn" :gutter="10">
            <el-col :span="16">
               <el-button type="primary" @click="handleDialog('add')"><i class="el-icon-plus" />添加</el-button>
              <!-- <el-button type="primary" @click="importUserInof('import')"><i class="el-icon-upload" />导入</el-button> -->
              <el-button type="primary" @click="exportUserInof('export')"><i class="el-icon-download" />导出全部</el-button>

              <el-button type="primary" @click="showSCwindow">
                <i class="el-icon-plus" />
                上传信息
              </el-button>
 
            </el-col>
            <el-col :span="8" class="text-right">
              <el-input v-model="search.key" placeholder="请输入关键字" class="input-with-select">
                <el-button slot="append" icon="el-icon-search" @click="getTableData" />
              </el-input>
            </el-col>
          </el-row>
        </div>
        <div class="wise-table">
          <el-table :data="tableData" border highlight-current-row>
            <el-table-column type="index" width="50" />
       
            <el-table-column label="焊口名称">
              <template slot-scope="scope"> {{ scope.row.hkname }} </template>
            </el-table-column>
            <el-table-column label="焊口编码">
              <template slot-scope="scope"> {{ scope.row.hkcode }} </template>
            </el-table-column>
            <el-table-column label="工艺名称">
              <template slot-scope="scope"> {{ scope.row.byzd1 }} </template>
            </el-table-column>
            <el-table-column label="工艺编码">
              <template slot-scope="scope"> {{ scope.row.byzd2 }} </template>
            </el-table-column>
            <el-table-column label="焊口时间">
              <template slot-scope="scope"> {{ scope.row.hktime }} </template>
            </el-table-column>
           
            <el-table-column label="操作">
              <template slot-scope="scope">
               
                <el-button   type="info" size="small" round  @click.native.prevent=" handleDialog('edit', scope.row.id)
                  ">编辑</el-button>
                <el-button type="danger" size="small" round @click.native.prevent="removeHandle(scope.row)">删除 </el-button>
                 
              </template>
            </el-table-column>
          </el-table>
          <div class="page-block">
            <pagination :background="true" layout="total,prev, pager, next" :total="ts" :page.sync="page.p"
              :limit.sync="page.ps" @pagination="getTableData" />
          </div>
        </div>
      </div>
    </div>
    <UserDialog ref="userDialog" @getList="getTableData" />
    <el-dialog ref="dialog" title="上传资料" :visible.sync="dialog" destroy-on-close>
      <div v-if="dialog" class="draw-body">
        <div class="wise-form">
          <el-form ref="ruleForm" :model="object" :rules="rules" :validate-on-rule-change="false" label-width="130px" label-suffix=":">
          
            <el-form-item label="附件上传" prop="fileUrl">
              <wise-file v-model="object.fileUrl" :limit="1" upload-type="file" />
            </el-form-item>
            <el-row type="flex" justify="end">
              <el-button @click="resetForm('ruleForm')">重置</el-button>
              <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
            </el-row>
          </el-form>
        </div>
      </div>
    </el-dialog>
  </div>
  
</template>

<script>
import { imgPath } from '@/filters'
  import {
    postHandle
  } from '@/api'
  import Pagination from '@/components/Pagination/index'
  import UserDialog from './components/hankouDialog'
   
  import checkPermission from '../../utils/permission'
 
  import WiseFile from '@/components/Crud/components/wiseFile'
  import { downloadHandle } from '@/api'
  import FileType from '@/components/Crud/components/fileType'
  export default {
    name: 'MemberManage',
    components: {
      Pagination,
      UserDialog,
      WiseFile, FileType 
    },  
    props: {
    
    filters: {
      type: Array
    },
    dataFields: {
      type: Array
    },
    filterObj: {
      type: Object
    },
    showSummary: {
      type: Boolean,
      default: false
    },
    summariesExcludeList: {
      type: Array,
      default: () => {
        return []
      }
    },
    tableRowClassNameFun: {
      type: Function
    },
    exporBeforeHandle: {
      type: Function
    },
    handle: {
      type: Array,
      default: () => {
        return ['add', 'search']
      }
    }
  },
    data() {
      return {
        columns: [],
        userCode: '',
        searchUserName: '',
        exportDrawer: false,
        isIndeterminate: true,
        checkAll: false,
        checkedfields: [],
        search: {
          key: '',
          fields: ['hkname','hkcode','byzd1','byzd2']
        },
        dataFilters: [],
        tableData: [],
        page: {
          p: 1,
          ps: 10
        },
        ts: 0,

        filterMethod(query, item) {
          return item.name.indexOf(query) > -1
        },
        loading: false,
        dialog: false,
        object: {
          fileUrl: null,
        },
        rules: {
          depict: [{ required: true, message: '必填项不能为空', trigger: 'blur' }],
          fileUrl: [{ required: true, message: '必填项不能为空', trigger: 'blur' }]
        },
      }
    },

    computed: {
      spaceId() {
        return this.$store.state.project.spaceId
      }
    },
    created() {
      this.getTableData()
    },
    methods: {
      checkPermission,
      initHandle(row) {
        this.$confirm('您确定要重置该用户的密码?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          })
          .then(() => {
            postHandle(
                '/api/v1/welder-uac-second/user-account-comb/init-password/' + row.userId, {}
              )
              .then((res) => {
                this.$message({
                  type: 'success',
                  message: '操作成功!'
                })
              })
              .catch(() => {
                this.$message({
                  type: 'error',
                  message: '操作失败'
                })
              })
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消删除'
            })
          })
      },

      handleDialog(type, id) {
        this.$nextTick(() => {
          this.$refs.userDialog.open(type, id)
        })
      },
      setDeptHandle(row) {
        this.$nextTick(() => {
          this.$refs.deptDialog.settingHandle(row)
        })
      },//导入
      importUserInof(row) {
        this.$nextTick(() => {
          this.$refs.deptDialog.settingHandle(row)
        })
      },//导出下载
      exportUserInof() {
      // if ( this.dataFilters.some(item => {
      //     return this.filtersItem.map(item => item.prop).indexOf(item.field) != -1
      //   })
      // ) {
        this.exportDrawer = true
      //} else {
       // this.$message.error('请选过滤您需要导出的数据')
      //}
    },
      getTableData() {
        const req = {
          d: {
            fields: [{
              name: 'professionList'
            }],
            filters: [{
              field: 'dwcode',
              operator: 'EQUALS',
              value: this.spaceId
            },{
              field: 'xmcode',
              operator: 'EQUALS',
              value:this.$store.state.project.object.id
            }],
            page: this.page,
            search: this.search,
            retPage: true
          },
          // obj: {
          //   username: this.searchUserName
          // }
        }
        postHandle(
          '/api/v1/welder-sbtx-second/hankoucomb-info/list',
          req
        ).then((response) => {
          this.tableData = response.result
          this.ts = response.page.ts
        })
      },

      removeHandle(row) {
        this.$confirm('您确定要删除给信息, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          })
          .then(() => {
            this.deleteObjectById(row.id)
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消移除'
            })
          })
      },

      deleteObjectById(id) {
        postHandle(
        
            '/api/v1/welder-sbtx-second/hankoucomb-info/removehk/' + id, {}
          )
          .then((response) => {
            this.getTableData()
            this.$message({
              type: 'success',
              message: '移除成功!'
            })
          })
          .catch((error) => {
            this.loading = false
            const data = error.response.data
            for (const key in data) {
              this.$message.error(this.$t(data[key]))
            }
          })
      },
      handleCheckAllChange(val) {
        this.checkedfields = val ? this.columns.filter(item => item.prop !== undefined).map(item => item.prop) : []
        this.isIndeterminate = false
      },
      handleCheckedFieldsChange(value) {
        let checkedCount = value.length
        this.checkAll = checkedCount === this.columns.filter(item => item.prop !== undefined).length
        this.isIndeterminate = checkedCount > 0 && checkedCount < this.columns.filter(item => item.prop !== undefined).length
      },

      exportUserInof() {
      this.$prompt('请输入自定义名称', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      })
        .then(({ value }) => {
          this.fullscreenLoading = true
          this.dataFilters.ap
          let params = {
            d: {
              filters:[{
                field:"st",
                operator:"NE",
                value:9
              },{
                field:"xmcode",
                operator:"EQUALS",
                value:this.$store.state.project.object.id
              },{
                field:"dwcode",
                operator:"EQUALS",
                value:this.$store.state.project.spaceId
              }],
              search: this.search
            },
            obj: {
              exportCodes: []
            }
          }
          params.obj.exportCodes = this.columns
            .filter(item => this.checkedfields.includes(item.prop))
            .map(item => ({ name: item.label, code: item.prop }))

          if (typeof this.exporBeforeHandle === 'function') {
            params = this.exporBeforeHandle(params)
          }
          downloadHandle("/api/v1/welder-sbtx-second/hankoucomb-info/export-hankouinfo", params)
            .then(res => {
              this.fullscreenLoading = false
              this.exportDrawer = false
             // let disposition = res.headers['content-disposition'].replace(/\"/g, '').split('=')
             // let fileName = decodeURI(disposition[disposition.length - 1])
              let blob = new Blob([res.data], { type: res.data.type })
              let downloadElement = document.createElement('a')
              let href = window.URL.createObjectURL(blob) // 创建下载的链接
              downloadElement.href = href
              downloadElement.download = value || fileName // 下载后文件名
              document.body.appendChild(downloadElement)
              downloadElement.click() // 点击下载
              document.body.removeChild(downloadElement) // 下载完成移除元素
              window.URL.revokeObjectURL(href) // 释放blob对象
            })
            
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '取消输入'
          })
        })
    }, showSCwindow() {
      this.object = {
        depict: null,
        fileUrl: null
      }
      this.dialog = true
    },
 // 重置
  resetForm(formName) {
      this.$refs[formName].resetFields()
    },
    
    // 提交上传
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        
        if (valid) {
          let params = {
             fileUrl: this.object.fileUrl,
             hhh:{
              xmcode:this.$store.state.project.object.id,
              xmname:this.$store.state.project.object.name,
              dwcode:this.$store.state.project.spaceId,
             }
          }
          postHandle(`/api/v1/welder-sbtx-second/hankoucomb-info/import-hankouinfo`, params).then(res => {
            
            this.dialog = false;
            this.$message({
            type: 'info',
            message: res.result
          })
          this.getTableData()
          }).catch(() => {
          this.$message({
            type: 'error',
            message: '上传失败'
          })
         }) 
        } else {
          return false
        }
      }) 
    },
  }                                                                             
  }
</script>

<style>
  .el-transfer .el-checkbox {
    display: block;
  }
</style>